<template>
    <span v-for="(item, index) in options" :key="index">
        <span>{{ item.text }}</span>
    </span>
</template>

<script lang="ts">
import {
    ref,
    toRefs,
    reactive,
    onMounted,
    defineProps,
    getCurrentInstance,
    watch,
    defineComponent,
} from "vue";
import request from "/@/utils/request";
import { Local } from "/@/utils/storage";

export default {
    name: "wg-clock",
    props: {
        // 数据
        id: String,
        //字典编码
        code: {
            type: String,
            default: "",
        },
    },
    setup: (props: Object) => {
        const { proxy } = getCurrentInstance();
        const state = reactive({
            dictionaryAllData: {
                type: Object,
                default: {},
            },
            options: [],
            value: "",
        });

        const initDictionaryData = () => {
            //Local.clear()
            state.dictionaryAllData = Local.get("dictionaryData");
            if (state.dictionaryAllData == null) {
                request({
                    url: "/api/system/dictionary/content/data/modelMap",
                    method: "get",
                    params: {},
                })
                    .then((res) => {
                        if (res.data.version) {
                            Local.set("dictionaryData", res.data.data);
                            state.dictionaryAllData = res.data.data;
                            initSelect();
                        }
                    })
                    .catch((error) => {
                        proxy.$wigem.log("字典接口异常");
                    });
            } else {
                initSelect();
            }
        };
        const initSelect = () => {
            let data: Object = state.dictionaryAllData[props.code];
            for (let key in data) {
                state.options.push(data[key]);
            }
            state.options = state.options.filter((item) => {
                return props.id == item.value;
            });
            // proxy.$wigem.log(state.options);
        };

        onMounted(() => {
            initDictionaryData();
        });
        watch(
            () => props.id,
            () => {
                state.options = state.options.filter((item) => {
                    return props.id == item.value;
                });
                initSelect();
            }
        );
        return {
            ...toRefs(state),
        };
    },
};
</script>
